<template>
  <div class="recommend">
      <h3 class="title">
       <!--  推荐歌单 -->
      </h3>
      <div class="items">
        <div class="item" v-for="(item,index) in recommendlist" :key="index" @click="toplaylist(item.id)" >
          <div class="img-wrap">
            <div class="desc-wrap">
              <span class="desc">{{item.copywriter}}</span>
            </div>
            <img :src="item.picUrl" alt="" />
            <span class="iconfont icon-play"></span>
          </div>
          <p class="name">{{item.name}}</p>
        </div>
      </div> 
    </div>
</template>

<script>  
import axios from 'axios'
export default {
    name:'recommend',
    data(){
      return{
        recommendlist:[]
      }
    },
    created(){
      axios({
        url:'https://autumnfish.cn/personalized',
        method:'get',
        params:{
           limit:10
        }
      }).then(res=>{
      /*   console.log(res) */
        this.recommendlist=res.data.result
      })
    },
    methods:{
      toplaylist(id){
        this.$router.push(`/playlist?q=${id}`)
      }
    }
}
</script>

<style>

</style>